<template>
	<view class="">
		<text class="title">请输入账号密码：</text>
		<input type="text" style="border: 1px solid #ccc;" placeholder="请输入账号" />
		<input type="passward" style="border: 1px solid #ccc;" placeholder="请输入密码" />
		<navigator url="/pages/index/index" open-type="reLaunch" style="color: blue;">提交登录</navigator> <!--路由跳转-->
	</view>
</template>

<script setup>
	import {
		ref
	} from "vue"
	let name = ref(1) //响应式数据

	//页面生命周期(uniapp)
	import {onInit, onLoad, onShow, onReady, onHide, onUnload, onResize, onPullDownRefresh, onReachBottom, 
	onTabItemTap, onShareAppMessage, onPageScroll, onNavigationBarButtonTap, onBackPress, onNavigationBarSearchInputChanged, onNavigationBarSearchInputConfirmed, 
	onNavigationBarSearchInputClicked, onShareTimeline, onAddToFavorites, /*onShareChat*/} from "@dcloudio/uni-app"
	// onInit((e) => { //监听页面初始化(百度小程序)
	// 	name.value = e.name
	// 	console.log(name.value)
	// })
	onLoad((e) => { //监听页面加载,先于setup
		name.value = e.name
		console.log('onLoad:' + name.value)
	})
	onShow(() => { //监听页面显示
		console.log('onShow')
	})
	onReady(() => { //监听页面初次渲染,类似onMounted挂载完，onLoad->onshow->onBeforeMount->onReady(dom已挂载)->onMounted
		console.log('onReady:' + name.value)
	})
	onHide(() => { //监听页面隐藏
		console.log('onHide')
	})
	onUnload(() => { //监听页面卸载
		console.log('onUnload')
	})
	// onResize(() => { //监听窗口尺寸变化
	// 	console.log('')
	// })
	onPullDownRefresh(() => { //监听用户下拉动作
		console.log('onPullDownRefresh')
	})
	onReachBottom(() => { //页面滚动到底部的事件
		console.log('onReachBottom')
	})
	// onTabItemTap(() => { //点击tab时触发
	// 	console.log('')
	// })
	// onShareAppMessage(() => { //用户点击右上角分享
	// 	console.log('')
	// })
	// onPageScroll((e) => { //**监听页面滚动
	// 	console.log(e.scrollTop)
	// })
	// onNavigationBarButtonTap(() => { //监听原生标题栏按钮点击事件
	// 	console.log('')
	// })
	// onBackPress(() => { //监听页面返回
	// 	console.log('')
	// })
	// onNavigationBarSearchInputChanged(() => { //监听原生标题栏搜索输入框输入内容变化事件
	// 	console.log('')
	// })
	// onNavigationBarSearchInputConfirmed(() => { //监听原生标题栏搜索输入框搜索事件(用户点击软键盘上的"搜索"按钮时触发)
	// 	console.log('')
	// })
	// onNavigationBarSearchInputClicked(() => { //监听原生标题栏搜索输入框点击事件(pages.json中searchInput配置disabled为true才会触发)
	// 	console.log('')
	// })
	// onShareTimeline(() => { //监听用户点击右上角转发到朋友圈
	// 	console.log('')
	// })
	// onAddToFavorites(() => { //监听用户点击右上角收藏
	// 	console.log('')
	// })
	// onShareChat(() => { //监听右上角菜单"分享到微信群组"按钮的行为
	// 	console.log('')
	// })
</script>

<style lang="scss" scoped> //嵌套css,样式作用域(样式仅当前组件生效)
	@import "@/common/css/style.css"; //导入common/css/style.css自定义样式
	.title{
		font-size: 30rpx;
		background-color: $uni-text-color-grey; //引用uni.css已有样式
		color: $custom-color-3; //引用uni.css自定义样式(需重启)
	}
</style>